<!doctype html>
<!--
 * This file is part of Cube.
 * https://shixincube.com
 * 
 * The MIT License (MIT)
 *
 * Copyright (c) 2020-2023 Cube Team.
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in all
 * copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 * SOFTWARE.
-->
<html>
<head>
    <meta charset="utf-8">
    <meta name="description" content="时信魔方示例,入门教程">
    <meta name="keywords" content="开源,开源软件,即时通信,IM,实时通信,团队协作,视频会议,音视频通话,SDK,多人协作,聊天软件,办公,WebRTC,RTC">
    <meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1, maximum-scale=1">
    <meta name="mobile-web-app-capable" content="yes">
    <meta id="theme-color" name="theme-color" content="#ffffff">
    <base target="_blank">

    <title>Cube Examples</title>

    <link rel="icon" sizes="192x192" href="images/favicon.png">
    <link rel="stylesheet" href="css/main.css">

    <style>
        h2 {
            font-size: 1.5em;
            font-weight: 500;
        }

        h3 {
            border-top: none;
        }

        section {
            border-bottom: 1px solid #eee;
            margin: 0 0 1.5em 0;
            padding: 0 0 1.5em 0;
        }

        section:last-child {
            border-bottom: none;
            margin: 0;
            padding: 0;
        }

        section ul {
            margin: 0.7em 0 0 0;
        }
        section li {
            line-height: 1.3em;
        }
    </style>
</head>

<body>
<div id="container">

    <h1>时信魔方示例</h1>

    <section>
        <p>
            时信魔方的 Web/HTML5 版示例程序。
        </p>
    </section>

    <section>
        <h2>基础</h2>
        <p>从 Hello World 开始讲解基础功能。</p>
        <ul>
            <li><a href="examples/hello-world/">Hello World</a></li>
            <li><a href="examples/event-callback/">事件回调机制</a></li>
            <li><a href="examples/contacts-mgmt/">联系人管理</a></li>
            <li><a href="examples/groups-mgmt/">群组管理</a></li>
        </ul>
    </section>

    <section>
        <h2>即时消息</h2>
        <p>与消息发送、接收、管理相关的示例。</p>
        <ul>
            <li><a href="examples/conversation/">消息会话管理</a></li>
            <li><a href="examples/sendrecv-message/">消息的发送与接收</a></li>
            <li><a href="examples/custom-message/">自定义消息</a></li>
        </ul>
    </section>

    <section>
        <h2>多方通讯</h2>
        <p>与多方音视频通讯相关的示例。</p>
        <ul>
            <li><a href="examples/contact-video/">联系人视频通话</a></li>
            <li><a href="examples/group-audio/">基于群组的语音通话</a></li>
            <li><a href="examples/group-video/">基于群组的视频通话</a></li>
        </ul>
    </section>

    <section>
        <h2>视/音频处理</h2>
        <p>视频和音频处理技术的示例。</p>
        <ul>
            <li><a href="examples/face-monitor/">人脸检测和监视</a></li>
            <li><a href="examples/media-player/">媒体播放器</a></li>
        </ul>
    </section>

    <section>
        <h2>云文件</h2>
        <p>与在线文件相关的示例。</p>
        <ul>
            <li><a href="examples/file-base/">基础文件操作</a></li>
            <li><a href="examples/file-processor/">文件处理</a></li>
        </ul>
    </section>

    <section>
        <h2>白板与桌面分享</h2>
        <p>与白板和桌面分享相关的示例。</p>
    </section>

    <section>
        <h2>在线会议</h2>
        <p>与在线会议相关的示例。</p>
    </section>
</div>
</body>
</html>
